<template>
  <div>
    <van-calendar :poppable="false" v-model="show" @confirm="onConfirm" :min-date="minDate" :max-date="maxDate" position="right" />
  </div>
</template>

<script>
export default {
  name: '',
  data() {
    return {
      date: '',
      show: true,
      
      minDate: new Date(new Date().getTime() - (30 * 24 * 3600 * 1000)),
      maxDate: new Date(),
    }
  },
  methods: {
    formatDate(date) {
      return `${date.getMonth() + 1}/${date.getDate()}`;
    },
    onConfirm(date) {
      this.show = false;
      this.date = this.formatDate(date);
    },
  },
}
</script>

<style>

</style>